/// <reference types="vite/client" />
/// <reference types="vite-svg-loader" />

import path from "node:path";
import vue from "@vitejs/plugin-vue";
import UnoCSS from "unocss/vite";
import AutoImport from "unplugin-auto-import/vite";
import IconsResolver from "unplugin-icons/resolver";
import Icons from "unplugin-icons/vite";
import { ElementPlusResolver } from "unplugin-vue-components/resolvers";
import Components from "unplugin-vue-components/vite";
import Inspect from "vite-plugin-inspect";
import svgLoader from "vite-svg-loader";

export const config = {
	resolve: {
		alias: {
			vue: "vue/dist/vue.esm-bundler.js",
			"~/": `${path.resolve(__dirname, "./")}/`,
		},
	},
	// css: {
	// 	preprocessorOptions: {
	// 		scss: {
	// 			additionalData: `@use "~/styles/element/index.scss" as *;`,
	// 		},
	// 	},
	// },
	plugins: [
		UnoCSS(),
		vue(),
		svgLoader({
			svgoConfig: {
				multipass: true,
			},
		}),
		AutoImport({
			include: [
				/\.[tj]sx?$/, // .ts, .tsx, .js, .jsx
				/\.vue$/,
				/\.vue\?vue/, // .vue
				/\.vue\.[tj]sx?\?vue/, // .vue (vue-loader with experimentalInlineMatchResource enabled)
				/\.md$/, // .md
			],
			imports: ["vue"],
			defaultExportByFilename: false,
			dirs: ["src/composable/*", "src/constants/*"],
			dts: "src/dts/auto-imports.d.ts",
			ignoreDts: ["ignoredFunction", /^ignore_/],
			vueTemplate: false,
			resolvers: [
				ElementPlusResolver({
					importStyle: "sass",
				}),
				IconsResolver({}),
			],
			viteOptimizeDeps: true,
			injectAtEnd: true,
			biomelintrc: {
				enabled: false,
				filepath: "./.biomelintrc-auto-import.json",
			},
		}),
		Components({
			resolvers: [
				ElementPlusResolver({
					importStyle: "sass",
				}),
				IconsResolver({}),
			],
			include: [/\.vue$/, /\.vue\?vue/, /\.vue\.[tj]sx?\?vue/],
			dts: "src/dts/components.d.ts",
			deep: true,
			dirs: ["src/components", "src/views"],
		}),
		Icons({
			autoInstall: true,
		}),
		Inspect(),
	],
};
